<template>
  <page-content :left="false">
    <space class="my-1">
      <option-form 
        :detailMode="true"
        :pass_put="pass_put"
        :pass_restore="pass_restore"
        :pass_delete="pass_delete"
        :pass_force_delete="pass_force_delete"
        :metaid="this.$route.meta.id"
        :selectedCount="1"
        :selectedRowKeys="[this.$route.params.id]"
      />
    </space>
    <a-descriptions bordered>
      <a-descriptions-item label="id">
        {{data.id}}
      </a-descriptions-item>
      <a-descriptions-item label="姓名">
        {{data.name}}
      </a-descriptions-item>
      <a-descriptions-item label="用户名">
        {{data.username}}
      </a-descriptions-item>
      <a-descriptions-item label="角色">
        <a-tag v-for="i of data.roles" color="blue">{{ i }}</a-tag>
      </a-descriptions-item>
      <a-descriptions-item label="权限">
        <a-tag v-for="i of data.permissions" color="blue">{{ i }}</a-tag>
      </a-descriptions-item>
      <a-descriptions-item label="创建时间">
        {{data.created_at}}
      </a-descriptions-item>
      <a-descriptions-item label="更新时间">
        {{data.updated_at}}
      </a-descriptions-item>
    </a-descriptions>
  </page-content>
</template>

<script>
import { mapConstants } from '@/libs/constants'
import { arrayWrap, can } from '@/libs/utils'
import FilePreview from '@c/FilePreview'
import DocPreview from '@c/DocPreview'
import PageContent from '@c/PageContent'
import OptionForm from '@c/OptionForm'
import Space from '@c/Space'
import {
  showAdminUser,
} from '@/api/admin-users'

export default {
  name: 'Detail',
  components: {
    FilePreview,
    DocPreview,
    PageContent,
    OptionForm,
    Space,
  },
  data() {
    return {
      data: {},
    }
  },
  computed: {
    ...mapConstants(['CONFIG_TYPES']),
    pass_put() {
      return !this.data.deleted_at && can('pass-put-admin-users')
    },
    pass_delete() {
      return !this.data.deleted_at && can('pass-delete-admin-users')
    },
    pass_restore() {
      return this.data.deleted_at && can('pass-restore')
    },
    pass_force_delete() {
      return this.data.deleted_at && can('pass-force-delete')
    },
  },
  methods: {
    arrayWrap,
    async showAdminUser(id) {
      const { data } = await showAdminUser(id)
      this.data = data
    },
    formatContent(content) {
      if (content !== null && content !== '') {
        return content.replace(/\n/g, "<br/>");
      }
    },
  },
  watch: {
    $route: {
      async handler() {
        await this.showAdminUser(this.$route.params.id)
      },
      immediate: true,
    },
  },
}
</script>